<template>
	<view class="content">
		<view class="list-container">
			<!-- <view class="shenhe-list clear edit_con">
				<text class="left input_text" >
					真实姓名
				</text>
				<input type="text" placeholder="请输入客户姓名" v-model="nickname" placeholder-style="font-size:30rpx" class="no_border_input left" />
			</view>	 -->
			<view class="shenhe-list clear edit_con">
				<text class="input_text" >
					联系电话
				</text>
				<input type="text" placeholder="请输入联系电话" v-model="phone" placeholder-style="font-size:30rpx;color:#999999" class="no_border_input left" @blur="testphone(1)" :disabled="disabled"/>
			    <text class="message">{{message1}}</text>
			</view>	
			<view class="shenhe-list clear edit_con">
				<text class="input_text">
					紧急联系人
				</text>
				<input type="text" placeholder="请输入紧急联系人" v-model="linkname" placeholder-style="font-size:30rpx;color:#999999" class="no_border_input left" :disabled="disabled"/>
			</view>	
			<view class="shenhe-list clear edit_con">
				<text class="input_text" >
					紧急联系人电话
				</text>
				<input type="text" placeholder="请输入紧急联系人电话" v-model="linkphone" placeholder-style="font-size:30rpx;color:#999999" class="no_border_input left" @blur="testphone(2)" :disabled="disabled"/>
			    <text class="message">{{message2}}</text>
			</view>	
			<view class="shenhe-list clear edit_con">
				<text class="input_text" >
					公司地址
				</text>
				<input type="text" placeholder="请输入公司地址" v-model="address" placeholder-style="font-size:30rpx;color:#999999" class="no_border_input " :disabled="disabled" />
			</view>	
			
			<view class="clear shenhe-text shenhe-text1" >
				<text class="left">身份证/驾驶证（身份证请上传正反面）</text>
				
			</view>
			<view class="clear hetong-list">
				<view class="left" v-for="(item,index) in numberpic1" :key="index" style="position: relative;">
					<icon type="clear" class="del_pic" size="15" @tap.stop="del_pic(1,item.url1,index)"></icon>
					<image :src="item.url" @tap="yulan(item.url)"></image>
				</view>

				<view class="left" v-if="btn_show1" @tap="uploadimg(1)" style="position: relative;">
					
					<image src="../../static/img/upload-icon.png" ></image>
				</view>
			</view>
			<view class="clear shenhe-text shenhe-text1" >
				<text class="left">营业执照/工作证明</text>
				
			</view>
			<view class="clear hetong-list">
				<view class="left" v-for="(item,index) in business1" :key="index" style="position: relative;">
					<icon type="clear" class="del_pic" size="15" @tap="del_pic(2,item.url1,index)"></icon>
					<image :src="item.url" @tap="yulan(item.url)"></image>
				</view>
				<view class="left" v-if="btn_show2" @tap="uploadimg(2)">
					<image src="../../static/img/upload-icon.png"></image>
				</view>
			</view>
			<view class="clear shenhe-text shenhe-text1" >
				<text class="left">其他附件</text>	
			</view>
			<view class="clear hetong-list">
				<view class="left" v-for="(item,index) in otherpic1" :key="index" style="position: relative;">
					<icon type="clear" class="del_pic" size="15" @tap="del_pic(3,item.url1,index)"></icon>
					<image :src="item.url" @tap="yulan(item.url)"></image>
					
				</view>
				
				<view class="left" v-if="btn_show2"  @tap="uploadimg(3)">
					<image src="../../static/img/upload-icon.png"></image>
				</view>
			</view>
			<view class="clear shenhe-text shenhe-text1" v-if="hetong.length!=0" >
				<text class="left">合同</text>	
			</view>
			<view class="clear hetong-list" v-if="hetong.length!=0">
				<view class="left" v-for="(item,index) in hetong" :key="index" style="position: relative;">
					<!-- <icon type="clear" class="del_pic" size="15" @tap="del_pic(3,item.url1,index)"></icon> -->
					<image :src="item.url" @tap="yulan(item.url)"></image>
				</view>
				
				<!-- <view class="left" v-if="btn_show2"  @tap="uploadimg(3)">
					<image src="../../static/img/upload-icon.png"></image>
				</view> -->
			</view>
		</view>
		<button class="big_button button_shadow" style="margin: 100rpx auto;" @tap="save()" >
			保存
		</button>
	</view>
</template>

<script>
	    import httpPath from '@/static/js/path.js';
		import {getlogin} from '@/static/js/login.js';
		import {fmoney} from '@/static/js/login.js';
		export default {
			data() {
				return {
					user:{},//用户登录信息
					address:"",//用户的地址
					phone:"",//联系人
					linkname:"",//紧急联系人
					linkphone:"",//紧急联系人电话
					nicheng:"",//昵称
					numberpic:"",//身份证，驾驶证
					numberpic1:[],//身份证，驾驶证
					business:"",//营业执照，工作证
					business1:[],//营业执照，工作证
					otherpic:"",//其他附件
					otherpic1:[],//其他附件
					btn_show1:true,//上传图片的按钮是否出现
					btn_show2:true,//上传图片的按钮是否出现
					info:{},
					message1:'',//联系电话的提示
					message2:'',//紧急联系电话的提示
					disabled:false,
					hetong:[],
				}
			},
			onLoad() {
				
	            this.user = getlogin();
				if(!this.user.islogin){
					uni.showModal({
					   showCancel:false,
					   content:"您还没有登录，请登录"
					})
					uni.navigateTo({
						url:"../public/login"
					})
				}
				this.getinfo();
			   
			},
			methods: { 
				testphone(type){
					var $phone=/^1(3|4|5|6|7|8|9)\d{9}$/;
					if(type==1){
						if(!$phone.test(this.phone)){
							this.message1="请输入正确的电话号码"
						}else{
							this.message1=""
						}
					}else{
						if(!$phone.test(this.linkphone)){
							this.message2="请输入正确的电话号码"
						}else{
							this.message2=""
						}
					}
				},
				yulan(img){
				  uni.previewImage({
					  urls: [img],
					  longPressActions: {
						  // itemList: ['发送给朋友', '保存图片', '收藏'],
						  success: function(data) {
							  console.log('选中了第' + (data.tapIndex + 1) + '个按钮,第' + (data.index + 1) + '张图片');
						  },
						  fail: function(err) {
							  console.log(err.errMsg);
						  }
					  }
				  });
				},
				getinfo(){//获取客户端首页信息
					uni.request({
						url: httpPath.filePath+'/api.php/index/member/member_info/',
						method:'POST',
						header:{'content-type':'application/x-www-form-urlencoded'},
						data: {member_id:this.user.member_id},
						success: (res) => {
							console.log(res)
							if(res.data.code=="200"){
								this.info=res.data.result;
                                this.phone=res.data.result.phone;
                                this.linkname=res.data.result.linkname;
                                this.linkphone=res.data.result.linkphone;
                                this.address=res.data.result.address;
								if(res.data.result.numberpic!=null||res.data.result.numberpic!=""){
									// this.numberpic=res.data.result.numberpic+",";
									console.log(res.data.result.numberpic)
									let num=this.str_array(res.data.result.numberpic);
									console.log(num)
									for (let i=0;i<num.length;i++) {
										this.numberpic1.push({url:httpPath.filePath+"/static/upload/image/"+num[i],url1:num[i]})
									}
									
								}	
								if(res.data.result.business!=null||res.data.result.business!=""){
									// this.business=res.data.result.business+",";
									let num=this.str_array(res.data.result.business);
									for (let i=0;i<num.length;i++) {
										this.business1.push({url:httpPath.filePath+"/static/upload/image/"+num[i],url1:num[i]})
									}
								}
								if(this.info.is_check==1){
									this.disabled=true;
								}
								if(res.data.result.otherpic!=null||res.data.result.otherpic!=""){
									// this.otherpic=res.data.result.otherpic+",";
									let num=this.str_array(res.data.result.otherpic);
									console.log(num)
									for (let i=0;i<num.length;i++) {
										
										this.otherpic1.push({url:httpPath.filePath+"/static/upload/image/"+num[i],url1:num[i]})
									}	
								}
								if(res.data.result.hetong!=""){
									let num=this.str_array(res.data.result.hetong);
									console.log(num)
									for (let i=0;i<num.length;i++) {
										this.hetong.push({url:httpPath.filePath+"/static/upload/image/"+num[i],url1:num[i]})
									}
								}
								
							}   
						}
					});
					
				},
				//将字符串转化成数组
				str_array(str){
					
					let arry=[];
					if(str==""||str==null){
						arry=[];
					}else if(str.indexOf(",")==-1){
						arry.push(str);
					}else{
						arry=str.split(",")
					}
					
					return arry;
				},
			    /*
				* 删除图片
				* type 1:身份证，驾驶证；2营业执照；3其他附件
				* url图片路径
				* index图片顺序
				*/

				del_pic(type,url,index){
					let _this=this;
					if(this.info.is_check==1){
						uni.showModal({
							content:"您的资料已经审核通过，请联系您的业务经理",
							showCancel:false
						})
						return false;
					}
					// uni.request({
					// 	url: httpPath.filePath+'/api.php/index/login/del_images',
					// 	method:'POST',
					// 	header:{'content-type':'application/x-www-form-urlencoded'},
					// 	data: {type:type,images:url},
					// 	success: (res) => {
					// 		if(res.data.code=="200"){
					// 			uni.showModal({
					// 				content:"删除成功"
					// 			})
								if(type==1){
									_this.numberpic1.splice(index,1);
								}else if(type==2){
									_this.business1.splice(index,1);
								}else if(type==3){
									_this.otherpic1.splice(index,1);
								}
								// uni.navigateBack()
					// 		}else{
					// 			uni.showModal({
					// 				content:res.data.message
					// 			})
					// 		}
							   
					// 	}
					// });
				},
				uploadimg(type){//上传图片
				    let _this=this;  
					type += '';
					 if(this.info.is_check==1){
						 uni.showModal({
						 	content:"您的资料已经审核通过，请联系您的业务经理",
						 	showCancel:false
						 })
						 return false;
					 }
				   // console.log(type)
					uni.chooseImage({
					    count: 6, //默认9
					    sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
					    sourceType:['album','camera'], //从相册选择
					    success: function (res) {	
					       for (var i = 0; i < res.tempFilePaths.length; i++) {
					       	    uni.uploadFile({
									url: httpPath.filePath+'/api.php/index/login/uplode_images', //仅为示例，非真实的接口地址
									filePath:res.tempFilePaths[i],
									name: 'upload-images',
									formData: {
										type:type
									},
									success: (uploadFileRes) => {
										let data =  eval("("+uploadFileRes.data+")");
										if(type==1){
											_this.numberpic1.push({"url":httpPath.filePath+"/static/upload/image/"+data,"url1":data});
										   
										}
										if(type==2){
											_this.business1.push({"url":httpPath.filePath+"/static/upload/image/"+data,"url1":data});
										    
										}
										if(type==3){
											_this.otherpic1.push({"url":httpPath.filePath+"/static/upload/image/"+data,"url1":data});
										    
										}
										
									}
								});
					       }
						   
					    }
					});
	            },
				/*
				*保存数据
				* */
				save(){
					if(this.info.is_check==1){
						uni.showModal({
							content:"您的资料已经审核通过，请联系您的业务经理",
							showCancel:false
						})
						return false;
					}
					var $phone=/^1(3|4|5|6|7|8|9)\d{9}$/;
					if(this.phone==""||this.phone==null){
						uni.showModal({
							showCancel:false,
							content:"请输入联系电话"
						})
						return false;
					}else if(!$phone.test(this.phone)){
						uni.showModal({
							showCancel:false,
							content:"请输入正确的电话号码"
						})
						return false;
					}
					if(this.linkname==""||this.linkname==null){
						uni.showModal({
							showCancel:false,
							content:"请输入紧急联系人"
						})
						return false;
					}
					if(this.linkphone==""||this.linkphone==null){
						uni.showModal({
							showCancel:false,
							content:"请输入紧急联系人电话"
						})
						return false;
					}else if(!$phone.test(this.linkphone)){
						uni.showModal({
							showCancel:false,
							content:"请输入正确的电话号码"
						})
						return false;
					}
					if(this.address==""||this.address==null){
						uni.showModal({
							showCancel:false,
							content:"请输入公司地址"
						})
						return false;
					}
					if(this.numberpic1.length==0){
						uni.showModal({
							showCancel:false,
							content:"请上传身份证/驾驶证"
						})
						return false;
					}else{
						this.numberpic="";
						for(let i=0;i<this.numberpic1.length;i++){
							this.numberpic+=this.numberpic1[i].url1+",";
						}
						var reg=/,$/gi;
						this.numberpic=this.numberpic.replace(reg,"");
					}
					if(this.business1.length==0){
						uni.showModal({
							showCancel:false,
							content:"请上传营业执照/工作证明"
						})
						return false;
					}else{
						this.business="";
						for(let i=0;i<this.business1.length;i++){
							this.business+=this.business1[i].url1+",";
						}
						var reg=/,$/gi;
						this.business=this.business.replace(reg,"");
					}
					if(this.otherpic1.length!=0){
						this.otherpic="";
						for(let i=0;i<this.otherpic1.length;i++){
							this.otherpic+=this.otherpic1[i].url1+",";
						}
						var reg=/,$/gi;
						this.otherpic=this.otherpic.replace(reg,"");
					}
				    // let data={member_id:this.user.member_id,address:this.address,phone:this.phone,linkname:this.linkname,linkphone:this.linkphone,numberpic:this.numberpic,business:this.business,otherpic:this.otherpic}
					// console.log(data)
					uni.request({
						url: httpPath.filePath+'/api.php/index/member/editMember/',
						method:'POST',
						header:{'content-type':'application/x-www-form-urlencoded'},
						data: {member_id:this.user.member_id,address:this.address,phone:this.phone,linkname:this.linkname,linkphone:this.linkphone,numberpic:this.numberpic,business:this.business,otherpic:this.otherpic},
						success: (res) => {
							if(res.data.code=="200"){
								uni.showModal({
									showCancel:false,
									content:"资料提交成功"
								})
								this.user.is_check=0;
								uni.setStorage({
								    key: 'user',
								    data: this.user,
								    success: function () {
								        console.log('success');
								    },
								});
								uni.navigateBack()
							}else{
								uni.showModal({
									showCancel:false,
									content:res.data.message
								})
							 }  
						}
					});
				}
			}
		}
	
</script>

<style>
	@import "../../colorui/main.css";
	page{background: #FFFFFF;}
	.hetong-list image{width: 100%;height: 100%;}
	.shenhe-text1{line-height: 120rpx!important;color: #323232;}
	.edit_con{padding: 10px 0px;}
	.message{position: absolute;top: 34px;font-size: 20rpx;color: #FF0000;left: 37%;}
</style>
